<style rel="stylesheet">
  #particles-js{position:fixed;top:0;left:0;right:0;bottom:0;background-size: cover;background-position: 50% 50%;background-repeat: no-repeat;}
  canvas{background: rgb(5,78,152);}
  .loginBox{top:calc(50% - 300px);left:calc(50% - 220px);position:fixed;margin:0 auto;width:440px;height:320px;}
  .login{background:#FFF;width:100%;border-radius:8px;height:320px;}
  .loginTitle{height:70px;line-height:70px;box-sizing:border-box;padding-left:35px;font-size:26px;font-weight:bold;color:#FFF;margin:0;}
  .login>.pull-left{width:440px;}
  .login>.pull-left{box-sizing:border-box;padding-left:35px;padding-top:60px;}
  .login>.pull-left li{height:50px;border:1px solid #999;box-sizing:border-box;border-radius: 4px;width:345px;position: relative;margin-bottom:23px;}
  .login>.pull-left li input{width:100%;height:100%;background: transparent;border:none;outline:none;box-sizing: border-box;padding-left:64px;padding-right:10px;}
  .login .loginImg{position:absolute; width:46px;height:30px;position:absolute;top:10px;left:0;border-right:1px solid #d9d9d9;text-align:center;line-height:30px;}
  .loginImg img{height:22px;vertical-align: top;line-height:30px;margin-top:4px;}
  .submit{height:50px;box-sizing:border-box;width:345px;text-align: center;}
  .submit span{display:inline-block;height:45px;background:linear-gradient(to bottom,#2c91f3,#0e65ba);width:140px;line-height:45px;text-align:center;color:#fff;font-size:14px;border-radius:5px;outline:none;}
  .errorMsg{width:345px;text-align: center;color:#e4393c;font-size:14px;margin-bottom:23px;}
</style>
<div id="particles-js"></div>
<div class="loginBox animated fadeInDown">
  <h2 class="loginTitle">网上书店管理系统</h2>
  <div class="login">
    <div class="pull-left">
      <ul class="unstyled no-padding">
        <li class="userName">
          <div class="loginImg"><img src="assets/images/userName.png"></div>
          <input ng-model="loginCtrl.username" type="text" placeholder="用户名" ng-keyup="loginCtrl.enterEvent($event)">
        </li>
        <li class="password">
          <div class="loginImg"><img src="assets/images/password.png"></div>
          <input ng-model="loginCtrl.password"  type="password" placeholder="密码" ng-keyup="loginCtrl.enterEvent($event)">
        </li>
      </ul>
      <div ng-if="loginCtrl.errorMsg" class="errorMsg">{{loginCtrl.errorMsg}}</div>
      <div class="submit"><span ng-click="loginCtrl.login()">登&nbsp;&nbsp;录</span></div>
    </div>
  </div>
</div>
<script src="assets/js/particles.min.js"></script>
<script src="assets/js/app.js"></script>
<script src="assets/js/stats.js"></script>
